<template>
	<view class="application_container">
		<uni-forms :modelValue="applications" >
			<uni-forms-item label="请假类型">
				<uni-data-select v-model='data_value' :localdata="Date_type"></uni-data-select>
			</uni-forms-item>
			<uni-forms-item label="请假时间">
				<uni-datetime-picker v-model="datetimerange" type="datetimerange" :start="datetimerange[0]"
					:end="datetimerange[1]" rangeSeparator="至" />
			</uni-forms-item>
			<uni-forms-item label="原因">
				<uni-easyinput v-model="reason"></uni-easyinput>
			</uni-forms-item>
		</uni-forms>
		<view class="application_button">
			<button class="tjbutten" @click="app" type="primary">提交</button>
		</view>
	</view>
</template>

<script>
	import {
		getUserProfile
	} from "@/api/system/user";
	import {
		application
	} from "@/api/application/application";
	export default {
		data() {
			return {
				reason:'',
				applications: {},
				datetimerange: ["", ""],
				data_value: 0,
				Date_type:[{value:0,text:'事假'},{value:1,text:'病假'},{value:2,text:'年假'}]
			}
		},
		mounted() {
			getUserProfile().then(res => {
				this.applications.userId = res.data.userId
			})
		},
		methods: { 
			app() {
				this.applications.reason='类型：'+this.Date_type[this.data_value].text+'，原因：'+this.reason;
				this.applications.startTime = this.datetimerange[0]
				this.applications.endTime = this.datetimerange[1]
				if(this.reason == '' || this.applications.startTime == '' || this.applications.endTime ==''){
					this.$modal.msgError('请填写完整信息')
				}else{
					application(this.applications).then(res => {
						if(res.code == 200){
							this.data_value=0;
							this.reason=''
							this.applications = {}
							this.datetimerange = ["", ""]
							this.$modal.showToast("提交成功")
						}else{
							this.$modal.msgError(res.msg)
						}
					})
				}
			},
		}
	}
</script>

<style>
	.application_container{
		padding-left: 5vw;
		padding-right: 5vw;
		position: relative;
		width: 100vw;
		height: 100vh;
	}
	.tjbutten {
		position: absolute;
		bottom: 0;
		width: 90vw;
		
	}
</style>
